<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Corporate Manage Rigodon Seat Allocation</title>

<script src="../js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="../css/bootstrap/js/bootstrap.min.js" type="text/javascript"></script> 
<link rel="stylesheet" type="text/css" href="../css/bootstrap/css/bootstrap.min.css">
<script src="../js/jquery-1.10.2.js" type="text/javascript"></script>
<script src="../js/jquery-ui-1.10.3.custom.min.js" type="text/javascript"></script>  
<script src="../js/jquery.maphilight.js" type="text/javascript"></script>
<script src="../js/seat-allocation-maphilight.js" type="text/javascript"></script>
<script src="../js/seat-allocation.js" type="text/javascript"></script>


</head>
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <a href="../" class="navbar-brand">SeatPoint</a>
                <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
                    <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
                    </span>
                </button>
            </div>
            <div class="navbar-collapse collapse" id="navbar-main">
                <ul class="nav navbar-nav">
                    <li class="dropdown"><a class="dropdown-toggle" href="corp-dashboard-notification.html" id="themes">Dashboard</a>
                    </li>
                    <li  class="active"><a href="corp-manage-request-rigodon.html">Manage Request</a> </li>
                    <!-- <li><a href="#">Manage Seat</a> </li> -->
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#" id="A1">
                        Hi Charles! <span class="caret"></span></a>
                        <ul class="dropdown-menu" aria-labelledby="setting">
                            <li><a tabindex="-1" href="login.html">Logout</a></li>
                            <li class="divider"></li>
                            <li><a tabindex="-1" href="#">Help</a></li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </div>
	<div class="container">
		<div class="page-header" id="banner">
            <div class="row">
                <div class="col-lg-6">
                    <h1>
                        SeatPoint</h1>
                    <p class="lead">
                        People Locator System</p>
                </div>
                <div class="col-lg-6">
                    <div class="well">
                        <div class="form-group">
                            <div class="input-group">
                                <input type="text" class="form-control" placeholder="Enter Employee Name" />
                                <span class="input-group-btn">
                                    <button class="btn btn-default" type="button" value="search">
                                        Search</button>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
		<div class="row">
			<ol class="breadcrumb">
              <li>Manage Request</li>
			  <li><a href="#">Rigodon</a></li>
			  <li>Assign Seat Allocation</li>
			</ol>
		</div>
		<div class="btn-group">
		  <div class="btn-group">
			<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
			  Select Project Manager
			  <span class="caret"></span>
			</button>
			<ul class="dropdown-menu">
			  <li ><a id="ahrefPM1" href="#">Project Manager 1</a></li>
			  <li ><a id="ahrefPM2" href="#">Project Manager 2</a></li>
			</ul>
		  </div>
		</div>
		<br/>		
		<!-- first form from dropdown choice of PM1 -->
		<div id="formForPM1" class="row" style="display:none;">
			<div class="col-lg-6">
				<ul class="list-group list-unstyled">
					<li class="list-unstyled">
						<label># of Resources</label>
						<span>40</span>
					</li>
					<li class="list-unstyled">
						<label>Preferred:  Area/Floor/Quadrant:</label>
						<span>PIC-3F-A</span>
					</li>
					<li class="list-unstyled">
						<label>Preferred Date:</label>
						<span>01/01/2013</span>
					</li>
				</ul>
			</div>
			<div class="col-lg-6">
				<ul class="list-group list-unstyled">
					<li class="list-unstyled">&nbsp;</li>
					<li class="list-unstyled">&nbsp;</li>
					<li class="list-unstyled">
						<label># of Seat Allocated / # of Seat Requested</label>
					<li>
				</ul>
			</div>
		</div>

		<!-- first form from dropdown choice of PM2 -->
		<div id="formForPM2" class="row" style="display:none;">
			<div class="col-lg-6">
				<ul class="list-group list-unstyled">
					<li class="list-unstyled">
						<label># of Resources</label>
						<span>20</span>
					</li>
					<li class="list-unstyled">
						<label>Preferred:  Area/Floor/Quadrant:</label>
						<span>PIC-4F-A</span>
					</li>
					<li class="list-unstyled">
						<label>Preferred Date:</label>
						<span>01/01/2013</span>
					</li>
				</ul>
			</div>
			<div class="col-lg-6">
				<ul class="list-group list-unstyled">
					<li class="list-unstyled">&nbsp;</li>
					<li class="list-unstyled">&nbsp;</li>
					<li class="list-unstyled">
						<label># of Seat Allocated / # of Seat Requested</label>
					<li>
				</ul>
			</div>
		</div>
		
		<!-- <div id="formForCheckBox"class="row" style="display:none;"> -->
		<div id="formForCheckBox"class="row" >
			<div class="col-lg-2">
				<ul class="list-group list-unstyled">
					<li class="list-group-item" style="border-width:0px;">
						<input id="chkSelectAll" type="checkbox" > Select All
					</li>
					<li class="list-group-item" style="border-width:0px;">
						<input id="chkSelectQuadrant" type="checkbox" > Select Quadrant 
					</li>
					<li class="list-group-item" style="border-width:0px;">
						<input id="chkSelectBlock" type="checkbox" > Select Block
					</li>
					<li class="list-group-item" style="border-width:0px;">
						<input id="chkSelectList" type="checkbox" > Select List
					</li>
				</ul>
			</div>	

			<div class="col-lg-10" >
				<img id="seatmap-3F" src="../images/PIC3F-933x730.PNG" alt="seatmap-3F" class="map" width="930" height="730" usemap="#seatmap">
				<map name="seatmap">
					<area id="quadrantA" shape="rect" coords="40,421,333,696" href="#" alt="quadrantA" class="group" data-maphilight='{"strokeColor":"18BC9C;","strokeWidth":5,"fillColor":"15A589","fillOpacity":0.6}'>
					<area id="quadrantB" shape="rect" coords="445,421,882,696" href="#" alt="quadrantB" class="group" data-maphilight='{"strokeColor":"18BC9C;","strokeWidth":5,"fillColor":"15A589","fillOpacity":0.6}'>
					<area id="quadrantC" shape="rect" coords="445,23,882,300" href="#" alt="quadrantC" class="group" data-maphilight='{"strokeColor":"18BC9C;","strokeWidth":5,"fillColor":"15A589","fillOpacity":0.6}'>
					<area id="quadrantD" shape="rect" coords="90,23,431,300" href="#" alt="quadrantD" class="group" data-maphilight='{"strokeColor":"18BC9C;","strokeWidth":5,"fillColor":"15A589","fillOpacity":0.6}'>
				</map> 
			</div> 
		</div>

		<div id="btnMap" class="row" >
			<div class="col-lg-6"></div>
			<div class="col-lg-6" >
				<ul class="list-inline list-unstyled" style="float:right;">
					<li class="list-unstyled">
						<!--<button id="btnSave" type="submit" class="btn btn-default">Save</button>-->
                         <a data-toggle="modal" href="#mySaveModal" class="btn btn-primary">Save</a>
					</li>
					<li class="list-unstyled">
						<!--<button id="btnConfirm" type="submit" class="btn btn-default">Confirm & Notify PM's</button>-->
                        <a data-toggle="modal" href="#myConfirmModal" class="btn btn-primary">Confirm & Notify PM's</a>
					</li>
				</ul>
			</div>
		</div>
	<!--</div> end div for container-->
	<footer>
	<hr>
	<div class="bs-docs-section">Test</div>
	<div class="row">
		<div class="col-lg-12">
			<p>&copy; 2013</p>
			<p>
				<a href="http://www.pointwset.com">www.pointwest.com</a>.
			</p>
			<p>Group 1</p>
		</div>
	</div>
	</footer>
	 <!-- Modal -->
      <div class="modal fade" id="mySaveModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h4 class="modal-title">Save Manage Rigodon</h4>
            </div>
            <div class="modal-body">
              All changes have been saved.
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <!-- <button type="button" class="btn btn-primary">Yes</button> -->
            </div>
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->

        <!-- Modal -->
      <div class="modal fade" id="myConfirmModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h4 class="modal-title">Confirm Manage Rigodon</h4>
            </div>
            <div class="modal-body">
              Are you sure you want to start new Seat Allocation Assignment?  This will notify all PM's.
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <!-- <button type="button" class="btn btn-primary">Ok</button> -->
            </div>
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->

	</div>
</body>
</html>